{% extends 'base.html' %}


{% block title %}
    Players
{% endblock %}

{% block content %}
<section id="showcase-inner" class="py-5 text-white">
    <div class="container">
      <div class="row text-center">
        <div class="col-md-12">
          <h1 class="display-4">Browse Our Player{{ name }}</h1>
          <p class="lead">National Basketball Association</p>
        </div>
      </div>
    </div>
  </section>

  <!-- Breadcrumb -->
  <section id="bc" class="mt-3">
    <div class="container">
      <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
          <li class="breadcrumb-item">
            <a href="{% url 'index' %}}">
              <i class="fas fa-home"></i> Home</a>
          </li>
          <li class="breadcrumb-item active"> Browse Players</li>
        </ol>
      </nav>
    </div>
  </section>

  <section id="listings" class="py-5">
    <div class="container">
      <h3 class="text-center mb-3">球员数据</h3>
      
        <!-- Listing 1 -->
        <!--<div class="col-md-6 col-lg-4 mb-4">-->
          <div class="start-5-data-table-listing">
            <table border="1" style="text-align:center">
              <thead>
              <tr>
                <th width="100"></th>
                <th>姓名</th>
                <th>分鐘</th>
                <th>得分</th>
                <th>籃板</th>
                <th>助攻</th>
                <th>命中</th>
                <th>出手</th>
                <th>命中率</th>
                <th>三分命中</th>
                <th>三分出手</th>
                <th>三分命中率</th>
                <th>失誤</th>
                <th>犯規</th>
              </tr>
            </thead>
            <tbody>
              {% if players %}
              {% for player in players %}
              <tr>
                  <th ><img class="card-img-top" src="{{ player.photo_main.url }}" alt=""></td>
                  <td>
                    <a href="{% url 'player' player.id %}">{{ player.name }}</a>
                  </td>
                  <td>{{ player.time }}</td>
                  <td>{{ player.score }}</td>
                  <td>{{ player.rebound }}</td>
                  <td>{{ player.assists }}</td>
                  <td>{{ player.hit }}</td>
                  <td>{{ player.shoot }}</td>
                  <td>{{ player.percentage }}</td>
                  <td>{{ player.threehit }}</td>
                  <td>{{ player.threeshoot }}</td>
                  <td>{{ player.threepercentage }}</td>
                  <td>{{ player.turnover }}</td>
                  <td>{{ player.foul }}</td>               
              </tr>
              {% endfor %}
              {% endif %}
            </tbody>
            </table>
      </div>
    </div>
  </section>


      <div class="row">
        <div class="col-md-12">
          {% if players.has_other_pages %}
          <ul class="pagination">
            {% if players.has_previous %}
            <li class="page-item">
              <a href="?page={{players.previous_page_number}}" class="page_link">&laquo;</a>
            </li>
            {% else %}
            <li class="page-item disabled">
              <a class="page-link">&lsquo;</a>
            </li>
            {% endif %}

            {% for i in players.paginator.page_range %}
              {% if players.number == i %}
                <li class="page-item cative">
                  <a class="page-link">{{ i }}</a>
                </li>
              {% else %}
              <li class="page-item">
                <a href="?page={{i}}" class="page-link">{{ i }}</a>
              </li>
              {% endif %}
              {% endfor %}

            {% if players.has_next %}
            <li class="page-item">
              <a href="?page={{players.next_page_number}}" class="page-link">&raquo;</a>
            </li>
            {% else %}
            <li class="page-item disabled">
              <a class="page-link">&rsaquo;</a>
            </li>
            {% endif %}
          </ul>
          {% endif %}
        </div>
      </div>
    </div>
  </section>
{% endblock %}
